import type { App } from 'vue'
import { useUserInfoStore } from '@/stores/userInfo'

export default function registerPermissionDirective(app: App) {
  const userInfoStore = useUserInfoStore()
  app.directive('permission', (el, binding) => {
    /*
      el 绑定指令的DOM元素
      binding 是一个对象
        包含表达式和表达式的值等信息
    */
    const isDisplay = userInfoStore.buttons.includes(binding.value)
    if (!isDisplay) {
      el.style.display = 'none'
    }
  })
}
